<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> 
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"  />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="screen-orientation" content="portrait">
<title>行骑网</title>
<script type="text/javascript" src="http://m.xq517.com/static/js/jquery.js"></script>
<script type="text/javascript">
var thisSiteURL = 'http://m.xq517.com/';
var tuangou_str = '特卖';
</script>
<script src="http://api.map.baidu.com/components?ak=nbZYk6ZZiBm3hwqNYzYRq5z6&v=1.0">
</script>
<style>
body{
font-family: 'MicroSoft Yahei',verdana,arial,tahoma;
font-size: 12px;
background: #FFF;
color: #333;
margin:0;
padding: 0;
}
h1, h2, h3, h4, div, li, p, menu, dl, dt, dd {
margin: 0;
padding: 0;
font-size: 100%;
font-weight: normal;
-webkit-tap-highlight-color: transparent;
}
ul, ol {
list-style: none;
}
 ul, ol, li, form {
margin: 0;
padding: 0;
-webkit-text-size-adjust: none;
}
a {
color: #333;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
header {
height: 50px;
display: block;
text-align: center;
background: #E4393C;
border-bottom: 1px #980063 solid;
background: -moz-linear-gradient(top,#E4393C,#E4393C);
background: -webkit-gradient(linear,0 0,0 100%,from(#E4393C),to(#E4393C));
}
.arrow-left {
float: left;
width: 13px;
height: 13px;
margin-left: 13px;
margin-top: 15px;
border: 2px solid #fff;
border-width: 2px 0 0 2px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.arrow-left:hover{
	background:none;
	float: left;
width: 13px;
height: 13px;
margin-left: 13px;
margin-top: 15px;
border: 2px solid #ff5a84;
border-width: 2px 0 0 2px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.w-header .home {
float: right;
width: 37px;
height: 100%;
background: url(http://m.xq517.com/templates/xqw/images/home.png) no-repeat center;
background-size: 21px;
}

.w-header .text {
margin: 0 100px;
text-align: center;
line-height: 50px;
font-size: 18px;
color: #fff;

}
.current-weizhi {
position: relative;
padding: 10px;
background: #fff;
}
#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;}

div.v3 {
min-height: 250px;
}
.common-item li {
width: 100%;
vertical-align: top;
padding: 0px;
margin: 0 auto;
overflow: hidden;
border-bottom: 1px solid #E5E5E5;
}  
div.v3 li a {
display: block;
background: #fff;

text-decoration: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.cf, div.v3 li a {
zoom: 1;
}
.common-item .pic {
margin: 10px 8px;
float: left;
padding: 2px;
width: 114px;
height: 73px;
border: 1px solid #CECECE;
border-radius: 2px;
background-color: #fff;
}   
common-item .pic img{
width: 114px;
height: 73px;
}   
.item-name {
padding: 12px 10px 0 10px;
text-align: left;
}
.item-name h2 {
line-height: 120%;
overflow: hidden;
color: #0C0C0C;
font-weight: bold;
margin-bottom: 5px;
font-size:14px;
}


.item-name h3 {
height:20px;
line-height:20px;

}

div.v3 li {
position: relative;
}
.goods-list-title {

height: 39px;
line-height: 39px;
color: #303030;
font-size: 14px;
text-indent: 10px;

border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #fff;

}
.a-tel {
width:70%;
float:left;
height: 29px;
line-height: 29px;
text-decoration: none;
color: #347e16;
font-size: 16px;
display: block;
background: #FFF;
}

.a-tel .icon {

display: inline-block;
height: 16px;
width: 16px;
margin-right: 10px;
vertical-align: middle;
margin-top: -4px;
border: 0;
background: url(http://s1.map.bdimg.com/mobile/simple/static/index/images/npush-icon_c1d57d2.png) 0 -28px no-repeat;
}
.icon.tel {
background-position: 0 -273px;
background-size: 32px 315px;
}
.a-distance{
text-align:right;
width:28%;
float:right;
color:#E4393C;
font-size:14px;
}
.location-tip{
-webkit-border-radius: 3px;
border-radius: 3px;

-webkit-box-align: center;
display: -webkit-box!important;
display: -webkit-flex!important;
-webkit-align-items: center;
height:30px;
padding: 5px;
background: #edf6fd;
border: 1px solid #b5caed;
margin-bottom:10px;
font-size: 14px;
}
.location-tip>* {
display: block!important;
-webkit-box-flex: 1;
-webkit-flex: 1;
}
.tip-text{
	color: #799fea;
	font-size: 13px;
}
.tip-icon{
display: block!important;
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
}
.tip-icon .icon{
display: inline-block;
font-family: mwa;
font-weight: 400;
font-style: normal;
font-style: normal;
font-variant: normal;
line-height: 1;
text-transform: none;
-webkit-font-smoothing: antialiased;
color: #6bb1f7;

}
.icon.-close:before {
font-size: 20px;
content: "\e61c";
}
</style>
</head>

<header class="w-header">
     <a class="arrow-left" href="javascript:history.back()"></a>
                 
					
                    <a href="/" class="home" ></a>
                    <div class="text">行骑网</div>

</header>

<body id="index">

  
<section class="current-weizhi">

<div class="location-tip" style="display:none">
<span class="tip-text">定位失败OR定位太离谱了?您还可以自己手动定位!</span>
<span class="tip-icon"><i class="icon -large -close"></i></span>
</div>

<!--
<div class="weizhi-wrap">
<div class="weizhi-icon">
<i class="icon-location"></i>
</div>


</div>
-->
<lbs-geo id="geo" city="北京" enable-modified="true"></lbs-geo>

</section>

<div class="content" id='content'>
<section class="goods-list-title">
最近修车点</section>
 <div class="v3">
  <ul class="common-item" id="listBoby">
  
  </ul>
 </div>
</div>


<script>
    // 先获取元素
var mapElement = document.getElementById('geo');
mapElement.addEventListener("geostart",function(evt){ //注册事件
	$(".change-loc").remove();
})
mapElement.addEventListener("geosuccess",function(evt){ //注册事件
	//$(".locbar-txt").after('<a class="change-loc -col3 -ft-brand" href="http://www.sina.com" >手动定位</a>');
	var obj = evt.detail.coords;
	var lacation = obj.lng + "," + obj.lat;

	getLbs(lacation);
	

});
 mapElement.addEventListener("geofail",function(evt){ //注册事件
	$(".location-tip").slideToggle();
	$(".locbar-txt").after('<a class="change-loc -col3 -ft-brand" href="http://www.sina.com" >手动定位</a>');
	var lacation = "113.90540310653,35.302830627872";
	getLbs(lacation);
	
	
});

function getLbs(location){
	var url = "http://api.map.baidu.com/geosearch/v3/nearby?callback=?";
	$.getJSON(url, {
				'q': '',
				'location': location,
				'radius':2000,
				'page_size': 10,
				'geotable_id': 68180,
				'sortby':'distance:1',
				'ak': 'ulGPujr1aHbOSi6okoBhkLzR'
			},
			function(e) {
				if(e.status!=0){
					alert("额,服务器抽风中,请稍后重试!");
					return;
				}
				renderList(e);
			});
}		
		
/* 
* 用来遍历指定对象所有的属性名称和值 
* obj 需要遍历的对象 
* author: Jet Mah 
*/ 
function allPrpos ( obj ) { 
// 用来保存所有的属性名称和值 
var props = "" ; 
// 开始遍历 
for ( var p in obj ){ 
// 方法 
if ( typeof ( obj [ p ]) == " function " ){ 
obj [ p ]() ; 
} else { 
// p 为属性名称，obj[p]为对应属性的值 
props += p + " = " + obj [ p ] + " \t " ; 
} 
} 
// 最后显示所有的属性 
alert ( props ) ; 
} 	

/**
     * 渲染列表模式
     * @param result
     * @param page
     */
function renderList(res) {

	var content = res.contents;
	$('#listBoby').html('');

	if (content.length == 0) {
		$('#listBoby').append($('<p style="border-top:1px solid #DDDDDD;padding-top:10px;text-align:center;text-align:center;font-size:18px;" class="text-warning">抱歉，没有找到您想要的短租信息，请重新查询</p>'));
		return;
	}

	$.each(content, function(i, item){
		$('#listBoby').append("<li class='single_item'> " + "<div class='item-name'> <h3>维修站：" + item.title + "</h3>" + "<h2>地址：" + item.address + "</h2>" + "<a class='a-tel'  href='tel:" + getNum(item.phone) + " '> <b class='icon tel'></b>" + item.phone + "</a><a class='a-distance'>" + item.distance + "米</a></div></li>");

	});

	//alert($('#listBoby').html());
}

function getNum(text) {
	var value = text.replace(/[^0-9]/ig, "");
	return value
}	
</script>

<style>
.nav-button {
height: 30px;
line-height: 30px;
display: inline-block;
text-align: center;
background: #FFF;
border: 1px #CCC solid;
border-radius: 3px;
cursor: pointer;
color: #6c6c6c;
text-shadow: 1px 1px 1px #FFF;
margin: 8px 0;
-webkit-box-shadow: 1px 1px 1px #FFF;
font-size: 14px;
background: -moz-linear-gradient(top,#fcfcfc,#f0f0f0);
background: -webkit-gradient(linear,0 0,0 100%,from(#fcfcfc),to(#f0f0f0));
}
footer nav {
	border-top:1px #d5d5d5 solid;
	border-bottom:1px #d5d5d5 solid;
	background:-moz-linear-gradient(top,#CCC,#FFF);
	background:-webkit-gradient(linear,0 0,0 100%,from(#f0f0f0),to(#FFF))
}
footer ul {
	font-size:0;
	text-align:center;
	height:35px;
	overflow:hidden;
	border-top:1px #FFF solid
}
footer nav li {
	display:inline-block;
	width:19%;
	font-size:12px;
	height:36px;
	line-height:36px;
	position:relative
}
footer nav li a {
	display:block;
	height:100%
}
footer nav li a:hover {
	background:0
}
footer nav li a:after {
	content:'-';
	display:block;
	height:28px;
	width:1px;
	background:#CCC;
	position:absolute;
	right:0;
	top:4px;
	font-size:0;
	text-indent:-9999px;
	background:-moz-linear-gradient(top,#FFF,#CCC,#FFF);
	background:-webkit-gradient(linear,0% 0,0% 100%,from(#FFF),to(#FFF),color-stop(0.5,#CCC))
}
footer nav li:last-child a:after {
	display:none
}
footer .copyright {
	margin-top:10px;
	position:relative;
	text-align:center;
	width:100%;
	font-size:12px;
	color:#999;
	height:30px
}
footer .copyright span {
	line-height:23px;
	background:#FFF;
	z-index:3px;
	top:0;
	margin:0 auto;
	z-index:4;
	padding:0 6px
}
footer .copyright p {
	height:1px;
	width:100%;
	text-indent:-9999px;
	font-size:0;
	position:absolute;
	top:11px;
	z-index:1;
	background:-moz-linear-gradient(left,#FFF,#CCC,#FFF);
	background:-webkit-gradient(linear,left 0,right 0,from(#FFF),to(#FFF),color-stop(0.5,#CCC))
}
footer section {
	position:relative;
	height:48px;
	width:100%;
	border-top:1px #d5d5d5 solid
}
footer section p {
	position:absolute;
	top:0;
	display:block
}
footer .user {
	line-height:48px;
	padding:0 0 0 8px
}
footer .user strong {
	margin:0 8px 0 0
}
footer .city {
	right:10px;
	line-height:48px
}
footer .city a {
	background:url(../images/icon-location.png) no-repeat 0 18px;
	padding-left:14px;
	background-size:12px 12px;
	margin:0 0 0 6px;
	display:inline-block;
	height:48px
}
footer .account {
	left:8px;
	top:8px;
	padding:0
}
footer .account .nav-button {
	margin:0;
	padding:0 20px
}
footer .account .signup {
	color:#ff3355
}
footer .account .login {
	color:#FFF;
	border-color:#E4393C;
	text-shadow:none;
	background:-moz-linear-gradient(top,#E4393C,#E4393C);
	background:-webkit-gradient(linear,0 0,0 100%,from(#E4393C),to(#E4393C))
}
footer .partner {
	padding:0 8px;
	color:#999
}
footer .partner strong,footer .partner ul,footer .partner ul li {
	display:inline-block;
	font-size:12px;
	font-weight:normal
}
footer .partner ul {
	height:auto;
	margin:0
}
footer .partner a {
	color:#999;
	margin:0 3px
}
</style>
<footer><section>
                
     
                 <p class="user"><strong><a href="/user">admin</a></strong>
		          <a id="logout" href="/account/logout"><span class="icon-logout"><i></i></span>退出</a>
		          </p>
                  
		          
          
                    
    <p class="city">新乡 </p></section>
            <nav>
                <ul>
                    <li><a gaevent="InnerLink|Click|touch/index" href="/">首页</a></li>
                    <li><a gaevent="InnerLink|Click|touch/orders" href="/user">账户</a></li>
                    <li><a gaevent="InnerLink|Click|touch/client" href="/user/coupon">特卖券</a></li>
                   <li><a gaevent="InnerLink|Click|touch/gowww" href="/wap">商家验证</a></li>
                    
                </ul>
            </nav>
        

            <div class="copyright"><span class="copyright">2014 行骑网</span>
          

            </div>
        </footer>
</body>
</html>		